<template>
  <view class="template-product tn-safe-area-inset-bottom">
    <view class="tn-margin-top tn-margin-bottom" v-if="videoSrc" >
     <video :src="videoSrc" style="width: 100%;height: 300px;" id="videoPlayer"></video>
    </view>
    <view class="tn-flex tn-padding tn-flex-col-center">
      <view class="tn-main-gradient-blue tn-margin-right tn-padding-xs tn-color-white tn-round tn-shadow-blur" v-for="(video,index) in chapter.videofile" @click="openVideo(video.url)">
        <text class="tn-padding-left-xs">公开课{{index+1}}</text>
      </view>
    </view>
  </view>
</template>

<script>
  import template_page_mixin from '@/libs/mixin/template_page_mixin.js'
  const pageDataCenter=uniCloud.importObject('page-data-center')
  export default {
    name: 'TemplateProduct',
    mixins: [template_page_mixin],
    data(){
      return {
        videoSrc: '',
		chapter:{
			videofile:null
		},
		showSelector:false,
		selector: [1, 2, 3],
        banner: 'https://resource.tuniaokj.com/images/swiper/ad1.jpg',
        current: 0,
		videoContext:null,
		timer:null,
      }
    },
	onLoad(option) {
		this.getData(option.id)
		this.videoContext = uni.createVideoContext('videoPlayer', this);
		
		//防录屏/截屏
		let platform = uni.getSystemInfoSync().platform;
			console.log(platform,'设备标识')
			//安卓手机
		if (platform === "android") {
			console.log(platform,'设备标识111---')
			if (wx.setVisualEffectOnCapture) {
					wx.setVisualEffectOnCapture({
					visualEffect: 'hidden',
					success: (res)=>{
						console.log('success录屏',res);
						}
				})
			}
			} else {	
				//苹果手机
				this.timer = setInterval(()=>{
					wx.getScreenRecordingState({
						success: (res)=>{
							console.log('success录屏22',res);
							if(res.state=='on'){
								this.videoContext.pause() //暂停视频播放
								uni.showModal({
									content:'此页面不允许录屏',
									showCancel:false,
									success: (res) => {
										if(res.confirm){
											uni.navigateBack()
										}
									}
								})
							}
						}
					})
				},2000)					
			}		
	},
	onUnload(){	
		if (wx.setVisualEffectOnCapture) {
				wx.setVisualEffectOnCapture({
				visualEffect: 'none',
				success: (res)=>{
					console.log('success',res);
				}
			})
		}
		if(this.timer) {  
				clearTimeout(this.timer);  
				this.timer = null;  
			}  
		
	},
    methods: {
		getData(id){
			pageDataCenter.getCourseDetail(id).then((res)=>{
				console.log(res)
				this.chapter=res.data
				this.openVideo(this.chapter.videofile[0]['url'])
			})
		},
		openVideo(src){
			this.videoSrc=src
		},
		openSelector(file){
			if(file.length >1){
				this.selector=file.map((item)=>item.name)
				this.showSelector=true
			}else{
				this.openVideo(file[0])
			}
		},
      // 跳转
      tn(e) {
      	uni.navigateTo({
      		url: e,
      	});
      },
	  goBack(){
		  uni.navigateBack()
	  }
    }
  }
</script>

<style lang="scss" scoped>
	@import '../course/course.scss';
</style>
